<template>
	
	<view class="u-page">
		<view class="u-demo-block">
			<view class="u-demo-block__content">
				<br>
				
				<u-row customStyle="margin-bottom: 10px">
					<u-col span="0.5">
						<view class="demo-layout bg-purple"></view>
					</u-col>
					
					<u-col span="11">
						<!-- <u--input placeholder="前置插槽">
									
										<u--text
											text="http://"
											slot="prefix"
											margin="0 3px 0 0"
											type="tips"
										></u--text>
		
									</u-input> -->
						<u-skeleton :loading="loading" animate rows=4 titleWidth=70% titleHeight=30 rowsHeight=30>
							<!-- <u--text type="info" text="工号:" customStyle="margin-bottom: 10px;margin-top:10px;"></u--text> -->
						
						<u-input placeholder="请输入内容" disabled border="surround" v-model="userid"
							@change="change" customStyle="margin-bottom: 15px;margin-top: 15px;">
						<u--text text="工号:" slot="prefix" margin="0 3px 0 0" type="tips"></u--text> 
						</u-input>
						<!-- <u--text type="info" text="姓名:" customStyle="margin-bottom: 10px;"></u--text> -->
						<u-input placeholder="请输入内容" disabled border="surround" v-model="name" @change="change"
							customStyle="margin-bottom: 15px">
							<u--text text="姓名:" slot="prefix" margin="0 3px 0 0" type="tips"></u--text>
						</u-input>
						<!-- <u--text type="info" text="培训项目:" customStyle="margin-bottom: 10px;"></u--text> -->
						<u-input placeholder="请输入内容" disabled border="surround" v-model="product_name" @change="change"
							customStyle="margin-bottom: 15px">
							<u--text text="培训项目:" slot="prefix" margin="0 3px 0 0" type="tips"></u--text>
						</u-input>
						<!-- <u--text type="info" text="培训类型:" customStyle="margin-bottom: 10px;"></u--text> -->
						<u-input placeholder="请输入内容" disabled border="surround" v-model="product_category_name"
							@change="change" customStyle="margin-bottom: 15px">
							<u--text text="培训类型:" slot="prefix" margin="0 3px 0 0" type="tips"></u--text>
						</u-input>
						 </u-skeleton>
						<u--text type="info" text="培训内容:" customStyle="margin-bottom: 10px"></u--text>
						<u-skeleton :loading="loading" animate rows=4 titleWidth=100% rowsWidth=100% titleHeight=80 rowsHeight=30 >
						<u--textarea v-model="product_content" placeholder="请输入内容" disabled="disabled" customStyle="margin-bottom: 15px"></u--textarea>
						<!-- <u--text type="info" text="培训开始时间:" customStyle="margin-bottom: 10px;"></u--text> -->
						<u-input placeholder="请输入内容" disabled border="surround" v-model="product_start_time"
							@change="change" customStyle="margin-bottom: 15px">
							<u--text text="培训开始时间:" slot="prefix" margin="0 3px 0 0" type="tips"></u--text>
						</u-input>
						<!-- <u--text type="info" text="培训结束时间:" customStyle="margin-bottom: 10px;"></u--text> -->
						<u-input placeholder="请输入内容" disabled border="surround" v-model="product_over_time"
							@change="change" customStyle="margin-bottom: 15px">
							<u--text text="培训结束时间:" slot="prefix" margin="0 3px 0 0" type="tips"></u--text>
						</u-input>
						<!-- <u--text type="info" text="培训组织:" customStyle="margin-bottom: 10px;"></u--text> -->
						<u-input placeholder="请输入内容" disabled border="surround" v-model="product_org_name"
							@change="change" customStyle="margin-bottom: 15px">
							<u--text text="培训组织:" slot="prefix" margin="0 3px 0 0" type="tips"></u--text>
						</u-input>
						<u--text type="info" text="上传视频" customStyle="margin-bottom: 10px"></u--text>
						<div v-if="status==1">
							<div v-if="condition<=1">
								<htz-image-upload :sourceType="['album', 'camera']" :max="1" v-model="ceshiData"
									@uploadSuccess="ceshiUploadSuccess" mediaType="video"
									action="https://ss.dzbx.zsbike.com.cn:8199/api.v1/Upload"></htz-image-upload>
									<u-button type="primary" text="确定" @click="refer"></u-button>
							</div>
							<div v-else>
								<htz-image-upload :sourceType="['album', 'camera']" :max="1" v-model="ceshiData"
									@uploadSuccess="ceshiUploadSuccess" :remove="false" mediaType="video"
									action="https://ss.dzbx.zsbike.com.cn:8199/api.v1/Upload"></htz-image-upload>
									<u-button type="primary" text="已审核,点击返回" @click="back"></u-button>
							</div>
						</div>
						<div v-else>
							<htz-image-upload :sourceType="['album', 'camera']" :max="1" v-model="ceshiData"
								@uploadSuccess="ceshiUploadSuccess" :remove="false" mediaType="video"
								action="https://ss.dzbx.zsbike.com.cn:8199/api.v1/Upload"></htz-image-upload>
								<u-button type="primary" text="不在填报时间段内" @click="back"></u-button>
						</div>
						
						<!-- 		        <view >配置上传路径，通过:uploadSuccess属性的</view> -->
						
				        </u-skeleton>
						<view>
							<u-toast ref="uToast"></u-toast>
							<!-- 	<u-cell-group title-bg-color="rgb(243, 244, 246)">
						</u-cell-group> -->
						</view>
						
					</u-col>
					<u-col span="0.5">
						<view class="demo-layout bg-purple-dark"></view>
					</u-col>
				</u-row>
		
           
			</view>
		</view>
	</view>
</template>

<style lang="scss">
	.wrap {
		padding: 12px;
	}

	.demo-layout {
		height: 25px;
		border-radius: 4px;
	}

	.u-page {
		padding: 0;
	}

	.u-cell-icon {
		width: 36rpx;
		height: 36rpx;
		margin-right: 8rpx;
	}

	.u-cell-group__title__text {
		font-weight: bold;
	}

	// .bg-purple {
	//     background: #CED7E1;
	// }

	// .bg-purple-light {
	//     background: #e5e9f2;
	// }

	// .bg-purple-dark {
	//     background: #99a9bf;
	// }
</style>
<script>
	import htzImageUpload from '@/components/htz-image-upload/htz-image-upload.vue'
	export default {
		data() {
			return {
				show: false,
				list: [{
						type: 'error',
						icon: false,
						title: '失败主题',
						message: "请上传视频",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
					},
					{
						type: 'success',
						title: '成功主题(带图标)',
						message: "提交成功",
						iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
					},
					{
							type: 'error',
							icon: false,
							title: '失败主题',
							message: "视频上传失败",
							iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/error.png'
						},
				],
				value: '',
				index:'',
				// fileList2: [],
				delivery_asn : '',
				status:"",
				is:"",
				disabled: true,
				product_name: "",
				product_category_name: "",
				userid: "",
				name: "",
				product_content: "",
				product_start_time: "",
				product_over_time: "",
				product_org_name: "",
				ceshiData: [],
				condition:'',
				vedio:"",
				loading:'',
				id:'',
				// ceshiData1: [],
				uniCloudData: [],
			}
		},
		computed: {
			getIcon() {
				return path => {
					return 'https://cdn.uviewui.com/uview/example/' + path + '.png';
				}
			},
		},
		components: {
			htzImageUpload,
		},
		// onshow(option) {
		// 	this.delivery_asn = option.id;
		// 	this.start();
		// },
		// onShow(option){
		// 	alert(option);
		// 	this.delivery_asn = option.id;
		// 	this.start();
		// 	},
		onLoad(option){
			// console.log(123);
			console.log(option.id);
			console.log(uni.getStorageSync("userid"));
			// alert(this.$route.query.id);
			this.checklogin();
			this.delivery_asn = option.id;
			this.index = option.index;
			this.start();
		},
		mounted(){
		this.loading = false
		},
		methods: {
			checklogin(){
				var userid = uni.getStorageSync("userid");
				this.userid = userid;
				if (typeof(userid)=="undefined" || userid=='' || userid==null)
				{
				  uni.navigateTo({
				  	url: "/pages/index/index"
				  });
				}
			},
			showToast(params) {
				this.$refs.uToast.show({
					...params,
					complete() {
						params.url && uni.navigateTo({
							url: params.url
						})
					}
				})
			},
			
			start() {
				// console.log(this.fileList2[0].url);
				// alert(123);
				uni.request({
					url: 'https://ss.dzbx.zsbike.com.cn:8199/api.v1/drive?id=' + this.delivery_asn, //仅为示例，并非真实接口地址。
					success: (res) => {
						console.log(res.data.data);
						this.product_name = res.data.data.product_name;
						this.product_category_name = res.data.data.product_category_name;
						this.userid = res.data.data.userid;
						this.name = res.data.data.name;
						this.product_content = res.data.data.product_content;
						this.product_start_time = time(res.data.data.product_start_time);
						this.product_over_time = time(res.data.data.product_over_time);
						this.product_org_name = res.data.data.product_org_name;
						this.condition = res.data.data.condition;
						this.status = res.data.data.status;
						if (res.data.data.video != undefined) {
							// this.showToast(this.list[0]);
							this.ceshiData.push(res.data.data.video);
							// alert("请上传视频");
						}
						// this.loading = false;

						function time(timestamp) {
							// 时间戳 
							// let timestamp = timestamp
							// 此处时间戳以毫秒为单位
					  let date = new Date(parseInt(timestamp) * 1000);
							let Year = date.getFullYear();
							let Moth = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date
							.getMonth() + 1);
							let Day = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
							let Hour = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours());
							let Minute = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date
						.getMinutes());
							let Sechond = (date.getSeconds() < 10 ? '0' + date.getSeconds() : date
							.getSeconds());
							let GMT = Year + '-' + Moth + '-' + Day;
							// let  GMT =  Year + '-' + Moth + '-' + Day + '   '+ Hour +':'+ Minute  + ':' + Sechond;

							return GMT;


						}

						// this.text = 'request success';
					}
				});
			},
			back(){
				uni.navigateBack({
					delta: 1
				});
			},
			refer() {
				if (this.ceshiData[0] == undefined) {
					this.showToast(this.list[0]);
					// alert("请上传视频");
				} else {		
					uni.request({
					    url: 'https://ss.dzbx.zsbike.com.cn:8199/api.v1/Refer?id='+this.delivery_asn+'&video='+this.ceshiData[0], //仅为示例，并非真实接口地址。
					    success: (res) => {
					    console.log(res.data.status);
							if(res.data.status){
								this.showToast(this.list[1]);
								uni.$emit('query' , {index : this.index});
										setTimeout(() => {
											uni.navigateBack({
												delta: 1
											});
										}, 1000)

							}else{
								this.showToast(this.list[2])
							}
					    }
					});
				}

			},
			change(e) {
				console.log('change', e);
			},
			ceshiUploadSuccess(res) { //上传成功
				/****************
				因为上传接口返回的结构不一致，所以以下代码需要根据实际的接口返回结构开发，在此只是展示如果给数组里添加的过程，仅供参考
				***************/
				this.ceshiData=[];
				var _res = JSON.parse(res.data);
				console.log(_res.url);
				this.vedio = _res.url;
				this.ceshiData.push(_res.url);
				// if (_res.code == 200) {
				//     this.ceshiData.push(_res.result);
				// }
				/*******************************/
			},
		}
	}
</script>
